<@override name="head">
<title>总体报表</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="${ctx}/assets/css/daterangepicker.css"/>
<link rel="stylesheet" href="${ctx}/assets/css/rpt.css"/>
<script type="text/javascript" src="${ctx}/assets/js/lib/moment.min.js"></script>
<script type="text/javascript" src="${ctx}/assets/js/lib/jquery.daterangepicker.js"></script>
<script type="text/javascript" src="${ctx}/assets/js/lib/date.js"></script>
<script type="text/javascript" src="${ctx}/assets/js/common/shortcutkey_datePicker.js"></script>
<script type="text/javascript" src="${ctx}/assets/js/report_advertiser.js"></script>
<script type="text/javascript" src="${ctx}/assets/js/rpt.js"></script>
</@override>
<@override name="body">
<div id=content_bg>

    <#include "/main/home/common.ftl"/>
    <input type="hidden" id="startTime" />
    <input type="hidden" id="endTime" />
    <input type="hidden" id="sortColumn" />
    <input type="hidden" id="sortType" />
    <div id="pagecontent">
        <div id="content">
            <div id="navDiv">
                <ul id="navDiv_ul">
                    <li><i class="icon-home"></i></li>
                    <li><a href="${ctx}/advertiser/main/dashboard">首页</a></li>
                    <li><i class="icon-angle-right"></i></li>
                    <li class="navDiv_currentLi"><a href="${ctx}/rpt/order/init">订单报表</a></li>
                </ul>
            </div>
            <div class="a-report-list">
                <div class="a-padding">
                    <div class="timeSelect">
                        <a href="javascript:$('#startTime').val('');$('#endTime').val('');$.loadOrderList();" class="active">全部</a>
                        <span class="a-line"></span>
                        <#list selector_date as item>
                            <a href="javascript:$('#startTime').val('${item.key}');$('#endTime').val('${item.value}');$.loadOrderList();">${item.title}</a>
                        </#list>
                    </div>
                    <div id="a-search">
                        <input type="text" name="searchText" id="searchText" placeholder="请输入订单名称/订单ID" />
                        <input id="a-search-icon" type="button" onclick="$.loadOrderList()" />
                    </div>
                </div>
            </div>
            <div class="scrollTable">
                <table border="1" class="tableFig tableReport" id="orderListTable">
                    <thead>
                        <tr class="theadTr">
                            <th style="width:2%">ID</th>
                            <th style="width:5%">订单名称</th>
                            <th class="theadTh hidden-impression" style="width:5%">
                                <a href="###" name="titleSort" sortColumn="1" sortType="1">曝光<i></i></a>
                            </th>
                            <th class="theadTh hidden-click" style="width:10%">
                                <a href="###" name="titleSort" sortColumn="2" sortType="1">点击数<i></i></a>
                            </th>
                            <th class="theadTh hidden-click" style="width:10%">
                                <a href="###" name="titleSort" sortColumn="3" sortType="1">点击率（%）<i></i></a>
                            </th>
                            <th class="theadTh hidden-consume" style="width:5%">
                                <a href="###" name="titleSort" sortColumn="4" sortType="1">eCPM（元）<i></i></a>
                            </th>
                            <th class="theadTh hidden-consume" style="width:5%">
                                <a href="###" name="titleSort" sortColumn="5" sortType="1">花费（元）<i></i></a>
                            </th>
                        </tr>
                    </thead>
                    <tbody></tbody>
                </table>
            </div>
            <div id="exportReport" />
            <div id="pageDiv" class="pages" />
        </div>
    </div>
</div>
</@override>
<@extends name="/common/simple.ftl"/>

<script>
$(function(){

    var SUCCESS = '000000';

    $('a[name=titleSort]').sortAndSearch('$.loadOrderList()');

    $.loadOrderList = function(no) {
        $.get('${ctx}/rpt/order/list',
            {
                'page.no' : no,
                'searchText' : $('#searchText').val(),
                'startTime' : $('#startTime').val(),
                'endTime' : $('#endTime').val(),
                'sortColumn' : $('#sortColumn').val(),
                'sortType' : $('#sortType').val()
            },
            
            function(data) {
                
                if(data.code != SUCCESS) {
                    alert(data.msg);
                    return;
                }
                
                var list = data.result.data;
                
                var _tab = $('#orderListTable');
                
                _tab.find('tbody tr').remove();
                
                // 数据
                for(var i = 0; i < list.length; i++) {
                
                    var _html = '';
                    _html += '<tr class="theadTr">';
                    _html += '    <td class="theadTd"><a class="blueColor" href="${ctx}/rpt/order/detail/init?id=' + list[i].id + '">' + list[i].id + '</a></td>';
                    _html += '    <td class="theadTd"><a class="blueColor" href="${ctx}/rpt/order/detail/init?id=' + list[i].id + '">' + list[i].name + '</a></td>';
                    _html += '    <td class="theadTd hidden-impression">' + $.format(list[i].show) + '</td>';
                    _html += '    <td class="theadTd hidden-click">' + $.format(list[i].click) + '</td>';
                    _html += '    <td class="theadTd hidden-consume">' + $.format(parseFloat(list[i].click_rate * 100.0).toFixed(2)) + '</td>';
                    _html += '    <td class="theadTd hidden-consume">' + $.format(parseFloat(list[i].ecpm).toFixed(2)) + '</td>';
                    _html += '    <td class="theadTd hidden-consume">' + $.format(parseFloat(list[i].revenue).toFixed(2)) + '</td>';
                    _html += '</tr>';
                    _tab.append(_html);
                }
                $('#pageDiv').page(data.result, '$.loadOrderList');
        });
    };
    
    $.loadOrderList();
    $('#searchText').keydown(function(e) {
        if(e.keyCode == 13) {
            $.loadOrderList();
        }
    }); 
});
</script>